<template>
  <section class="border padding">
    <el-row>
      <el-input v-model="filters.reqTitle" style="width: 20%;" placeholder="申请标题查询 输入 *字符* >10 <9 等"
                clearable title="支持>、<、 >=、<=、!=、*字符*、$IS NULL、$IN 1,2,3、$between 1,5等操作符"/>

      <el-input v-model="filters.reqUsername" style="width: 20%;" placeholder="申请人查询 输入 *字符* >10 <9 等"
                clearable title="支持>、<、 >=、<=、!=、*字符*、$IS NULL、$IN 1,2,3、$between 1,5等操作符"/>

      <el-button v-loading="load.list" :disabled="load.list==true" @click="searchTableDatas()" icon="el-icon-search"
                 type="primary">查询
      </el-button>
      <span style="float:right;" v-if="currOpType=='mng'">
                <el-button :disabled="disabledJudge('addBtn') || !checkBtnQx('addBtn',menuDefId) " type="primary"
                           @click="openForm({parentOpType:currOpType,subOpType:'add',formData:addForm,title:'新增'})"
                           icon="el-icon-plus">发起申请</el-button>
                <el-button
                    :disabled="disabledJudge('delBtn') || !checkBtnQx('delBtn',menuDefId) || this.sels.length===0 || load.del==true"
                    type="danger" v-loading="load.del" @click="batchDel" icon="el-icon-delete">批量删除</el-button>
            </span>
      <span style="float:right;" v-else-if="currOpType=='select' &&  this.multiple==true">
                <el-button :disabled="disabledJudge('selectBtn') || this.sels.length===0" type="primary"
                           @click="selectListConfirm" icon="el-icon-check"/>
            </span>
    </el-row>
    <el-row>
      <mdp-hi-query :column-configs="columnConfigs" v-model="hiQueryParams" @change="onHiQueryParamsChange"/>
      <el-button type="text" icon="el-icon-zoom-out" @click="searchReset()">重置查询</el-button>&nbsp;&nbsp;&nbsp;
    </el-row>
    <el-row>
      <!--列表 AssetInventoryTask ass_asset_inventory_task-->
      <el-table :ref="refId+'Table'" :height="100" v-adaptive="{bottomOffset: bottomOffset}" :data="tableDatas"
                @sort-change="sortChange" highlight-current-row v-loading="load.list" border @cell-click="cellClick"
                @selection-change="selsChange" @row-click="rowClick" style="width: 100%;">
        <el-table-column type="selection" width="55" show-overflow-tooltip fixed="left"
                         v-if="currOpType=='mng' || this.multiple==true"></el-table-column>
        <el-table-column sortable type="index" width="55" show-overflow-tooltip fixed="left"></el-table-column>

        <el-table-column prop="reqTitle" label="申请标题" min-width="120" show-overflow-tooltip col-type="String"
                         v-if="showCol('reqTitle')">
          <template slot-scope="scope">
            <mdp-input show-style="tag" v-model="scope.row.reqTitle" :maxlength="50"
                       @change="editSomeFields(scope.row,'reqTitle',$event)"
                       :disabled="!editable || disabledJudge('reqTitle')"/>
          </template>
        </el-table-column>
        <el-table-column prop="reqUsername" label="申请人姓名" min-width="120" show-overflow-tooltip col-type="String"
                         v-if="showCol('reqUsername')">
          <template slot-scope="scope">
            <mdp-input show-style="tag" v-model="scope.row.reqUsername" :maxlength="50"
                       @change="editSomeFields(scope.row,'reqUsername',$event)"
                       :disabled="!editable || disabledJudge('reqUsername')"/>
          </template>
        </el-table-column>
        <el-table-column prop="reqDate" label="申请日期" min-width="120" show-overflow-tooltip col-type="Date"
                         v-if="showCol('reqDate')">
          <template slot-scope="scope">
            <mdp-date type="date" placeholder="选择日期" show-style="tag" v-model="scope.row.reqDate"
                      @change="editSomeFields(scope.row,'reqDate',$event)" value-format="yyyy-MM-dd HH:mm:ss"
                      format="yyyy-MM-dd" :disabled="!editable || disabledJudge('reqDate')"/>
          </template>
        </el-table-column>
        <el-table-column prop="taskStatus" label="notStart未开始" min-width="120" show-overflow-tooltip
                         col-type="String" v-if="showCol('taskStatus')">
          <template slot-scope="scope">
            <mdp-input show-style="tag" v-model="scope.row.taskStatus" :maxlength="10"
                       @change="editSomeFields(scope.row,'taskStatus',$event)"
                       :disabled="!editable || disabledJudge('taskStatus')">
              <span>{{
                  scope.row.taskStatus === 'notStart' ? '未开始' : scope.row.taskStatus === 'over' ? '已完成' : '进行中'
                }}</span>
            </mdp-input>
          </template>
        </el-table-column>
        <el-table-column prop="reqStatus" label="hold" min-width="120" show-overflow-tooltip col-type="String"
                         v-if="showCol('reqStatus')">
          <template slot-scope="scope">
            <mdp-input show-style="tag" v-model="scope.row.reqStatus" :maxlength="10"
                       @change="editSomeFields(scope.row,'reqStatus',$event)"
                       :disabled="!editable || disabledJudge('reqStatus')">
              <span>{{ scope.row.reqStatus === 'hold' ? '草稿' : '已发布' }}</span>
            </mdp-input>
          </template>
        </el-table-column>

        <!--        操作-->
        <el-table-column label="操作" :width="currOpType=='mng'?180:80" fixed="right">
          <template slot="header" slot-scope="scope">
            <el-button icon="el-icon-download" @click="export2Excel()">导出</el-button>
          </template>
          <template scope="scope" v-if="currOpType=='mng'">
            <el-button
                :disabled="disabledJudge('editBtn') || !checkBtnQx('editBtn',menuDefId) || scope.row.reqStatus === 'submit'"
                type="primary"
                @click="openForm({parentOpType:currOpType,subOpType:'edit',formData:scope.row,title:'修改'})"
                icon="el-icon-edit" title="修改一条数据"/>
            <el-button :disabled="disabledJudge('delBtn') || !checkBtnQx('delBtn',menuDefId) " type="danger"
                       @click="handleDel(scope.row,scope.$index)" icon="el-icon-delete" title="删除一条数据"/>
          </template>

          <template scope="scope" v-else-if="currOpType=='list'">
            <el-button type="primary" @click="openForm({parentOpType:currOpType,subOpType:'detail',formData:scope.row})"
                       icon="el-icon-view"/>
          </template>

          <template scope="scope" v-else-if="currOpType=='select' && this.multiple!=true">
            <el-button type="primary" @click="selectConfirm(scope.row)" icon="el-icon-check"/>
          </template>
        </el-table-column>
      </el-table>
    </el-row>
    <el-row>
      <el-pagination
          layout="slot,total, sizes, prev, next,pager,jumper"
          @current-change="handleCurrentChange"
          @size-change="handleSizeChange"
          :page-sizes="[10,20, 50, 100, 500]"
          :current-page="pageInfo.pageNum"
          :page-size="pageInfo.pageSize"
          :total="pageInfo.total"
          style="float:right;"
      >
      </el-pagination>
    </el-row>
    <el-row>
      <!--新增修改明细 AssetInventoryTask ass_asset_inventory_task界面-->
      <mdp-dialog :ref="refId+'FormDialog'">
        <template v-slot="{visible,data,dialog}">
          <asset-inventory-task-form :ref="refId+'Form'" :visible="visible" :parent-op-type="currOpType"
                                     :sub-op-type="data.subOpType" :form-data="data.formData" @close="onFormClose"
                                     @submit="afterFormSubmit" @fields-change="afterEditSomeFields"/>
        </template>
      </mdp-dialog>

      <!--编辑 AssetInventoryTask ass_asset_inventory_task界面-->
      <el-dialog title="盘点任务" center :fullscreen="true" :visible.sync="detailFormVisible"
                 :close-on-click-modal="false">
        <asset-inventory-task-detail :asset-inventory-task="detailForm" :visible="detailFormVisible"
                                     @cancel="detailFormVisible=false"></asset-inventory-task-detail>
      </el-dialog>
    </el-row>
  </section>
</template>

<script>

import {MdpTableMixin} from '@/components/mdp-ui/mixin/MdpTableMixin.js';
import * as AssetInventoryTaskApi from '@/api/oa/erp/ass/assetInventoryTask';
import AssetInventoryTaskForm from './Form';//新增修改明细界面
import {mapGetters} from 'vuex'
import AssetInventoryTaskDetail from './AssetInventoryTaskDetail'; //明细操作页面

export default {
  name: 'assetInventoryTaskMng',
  mixins: [MdpTableMixin],
  components: {
    'asset-inventory-task-detail': AssetInventoryTaskDetail,
    AssetInventoryTaskForm,
  },
  computed: {},
  watch: {},
  data() {
    return {
      detailForm: null,
      detailFormVisible: false,
      menuDefId: '',//menu_def.id 菜单表菜单编号，用于按钮权限判断
      menuDefName: 'ass_asset_inventory_task',//menu_def.name 功能名称，用于导出excel等文件名
      refId: 'assetInventoryTask',//引用编号，<table :ref="refId+'Table'"> <form :ref="refId+'Form'">
      pkNames: ["taskId"],//表格主键的java属性名称，驼峰命名，默认为id,支持多主键
      currOpType: 'mng',//表格 mng-综合管理具有最大权限，所有按钮可动、detail-只看不能操作
      filters: {//查询参数

      },
      defaultFilters: {//默认查询参数,第一次打开界面的时候用到，恢复默认值的时候用到

      },

      defaultCheckColumnNum: 8,//默认展示的表格列数，前8列

      editable: false,//是否可编辑模式

      //增删改查(含批量)接口
      apis: {
        list: AssetInventoryTaskApi.listAssetInventoryTask,
        add: AssetInventoryTaskApi.addAssetInventoryTask,
        del: AssetInventoryTaskApi.delAssetInventoryTask,
        edit: AssetInventoryTaskApi.editAssetInventoryTask,
        editSomeFields: AssetInventoryTaskApi.editSomeFieldsAssetInventoryTask,
        batchAdd: AssetInventoryTaskApi.batchAddAssetInventoryTask,
        batchDel: AssetInventoryTaskApi.batchDelAssetInventoryTask,
        batchEdit: AssetInventoryTaskApi.batchEditAssetInventoryTask,
      }
    }
  },
  methods: {
    rowClick: function (row, event, column) {
      this.$emit('row-click', row, event, column);
    },

    /**begin 自定义函数请在下面加**/
    cellClick: function (row, column, cell, event) {
      if (column.label == '操作') {
        return;
      }
      this.detailForm = Object.assign({}, row);
      this.detailFormVisible = true;
      console.log(222, this.detailForm);
    },
    //页面初始化需要配置的特殊逻辑写这里
    initCurrData() {
      this.searchTableDatas();
    },

    /**
     * 检查参数是否满足调用后台接口的条件
     *
     * @param params 提交给后台的参数池,map类型
     * @returns true / false
     */
    preQueryParamCheck(params) {
      params.count = false;
      return true;
    },

    //页面数据加载完后需要对数据进行加工处理的
    afterList(tableDatas, isOk, apiName) {

    },

    /**
     * 对修改的字段进行判断，返回false ,将取消更新数据库
     * @param {*} row 当前选中的行
     * @param {*} fieldName 修改的字段名
     * @param {*} $event 修改后的值
     * @param {*} params 将要提交服务器的参数
     * @returns true/false 返回false ,将取消更新数据库
     */
    editSomeFieldsCheck(row, fieldName, $event, params) {
      if (this.currOpType == 'add' || this.currOpType == 'detail') {
        return false;
      }
      params[fieldName] = $event
      return true;
    },
  },
  mounted() {

  }
}

</script>

<style scoped>
</style>
